<!DOCTYPE html>
<!--[if lt IE 7]>
<html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>
<html class="lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>
<html class="lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html> <!--<![endif]-->

<#include "../common/assignparam.ftl"  />
<@header deep="2"/>
<script src="../../common/klxlearning/pageComponents.js" type="text/javascript"></script> 
<script src="../../common/jquery-validation/jquery.validate.min.js" type="text/javascript"></script> 
<script src="../../common/jquery-validation/localization/messages_zh.js" type="text/javascript"></script> 
<script src="../../common/klxlearning/cardValid.js" type="text/javascript"></script>
<style type="text/css">
	.font-21-white{
		font-size: 21px;
		color: #fff;
	}
</style>
<body class="body">
<!-- 头部 -->
 <#assign currentChannel="userspace"/>
<#include "../common/header.ftl"  />  

<div style="box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); width: 100%;">
  <!--个人中心-->             
  <div>
    <div class="content-container-top" id="userSpaceTop">
		</div>
	
	<div class="container">
		<div class="row">	
			<div class="col-md-3 left-menu">
      <!--个人中心菜单-->
  			<div class="sidenav">
				<ul class="list-group">
					<li class="list-group-heading">我的学习</li>
					<li class="list-group-item active" showLayer="myCourses">
                        <a>我的课程</a>
                    </li>
					<li class="list-group-heading">个人设置</li>  
					<li class="list-group-item" showLayer="BaseInformation">
					  <a> 基础信息</a>
					</li>
					<li class="list-group-item" showLayer="uploadImg">
					  <a >头像设置</a>
					</li>
					<li class="list-group-item " showLayer="fixpwd">
					  <a>安全设置</a>
					</li>         
					<li class="list-group-item " style="display: none;">
					  <a href="${contextPath}/portal/frontend/dgo?ftlpath=userspace/securitysetting/binds.ftl"> 第三方登录</a>
					</li>
					<li class="list-group-heading" style="display: none;">账户中心</li>
			          <li class="list-group-item " style="display: none;">
			            <a href="${contextPath}/portal/frontend/dgo?ftlpath=userspace/shopping/orders.ftl">我的订单</a>
			          </li>
				</ul>
  			</div>
  		</div> 
  		<div class="col-md-9 right-conte">
      	<div class="panel panel-default panel-col myCourses">
  				<div class="center-btn">
            <span class="active">自选课</span>
            <!--<span>指定课</span>
            <span>最近浏览</span>-->
            <div class="center-group2">
              <!--<div class="center-group3">
                   <a href="../course1.htm">
                  <input type="text" name="search" class="form-control mate-rial" placeholder="请搜索课程..." tabindex="3">
                  <i class="glyphicon glyphicon-search"></i>
                  </a>
              </div>-->
            </div>
          </div>
          <!--自选课-->
          <div class="center-list" style="display:block;">
            <div class="panel-body">
                <ul class="nav nav-pills selection">
                    <li class="active"><a href="javascript:;" id="learningBtn">学习中</a></li>
                    <li class=""><a href="javascript:;" id="learnedBtn">已学完</a></li>
                </ul>
            </div>
            <!--学习中-->
            <div class="center-product-blcok" style="display: block;">
	            <div class="conList" id="learning">
	            </div> 
			</div> 
			<div class="center-product-blcok" style="display: none;">
	            <div class="conList1" id="learned">
	            </div> 
	           
		    </div>
		    <div class="paging"> 
	    		<div class="clear"></div>
			</div>
  		</div>
		</div>
   		 <!-- 基础信息填写 -->
        <#include "userinfo/userinfo.ftl"/>      
          <!-- 上传头像 -->
        <#include "userinfo/headphoto.ftl"/>	
        <!-- 安全设置 密码修改 -->
		<#include "securitysetting/fixpwd.ftl"/>		  
		</div>
    <!-- 重复课程 -->
  </div>
  
</div>
<!--底部-->

<@portalFooter deep="2"/>

<!-- 侧边栏快捷操作 -->
<#include "../common/learningCenterSlider.ftl"  />  

  
<div id="login-modal" class="modal" data-url="/login/ajax"></div>
<div id="modal" class="modal"></div>

<!-- 个人信息头部模板 -->
<script type="text/template" id="userSpaceTopTpl">
   <div class="container">
    <div class="row">
      <div class="col-md-12">
        <div class="row">
          <div class="col-md-3">
            <!--个人中心个人信息-->
            <div class="sidenav-center">
              <div class="center-image"><img src="<%= accountBean.headPhoto %>"></div>
              <div class="center-name">
                <p><span class="center-name-top"><%= accountBean.name %></span></p>
                <!--<p><span class="center-name-bottom">这位同学很懒，木有签名。</span></p>-->
              </div>
            </div>
          </div>
          <!--账户详情介绍-->
          <div class="col-md-4 col-xs-12">
            <div class="center-details03">
              <p>指标明细</p>
              <p>周期:<span><%=userTargetList[0].targetConfigBean.targetBeginTime%>至<%=userTargetList[0].targetConfigBean.targetEndTime%></span></p>
            </div>
          </div>
          <div class="center-details-big col-md-5 col-xs-12">
            <div class="center-details">
                <div class="center-details-1">学时的进度：</div>
                <div class="progress">
          <div class="progress-bar" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: <%=userTargetList[0].timeRatio%>%;">
         <%=userTargetList[0].timeRatio%>%
          </div>
        </div>
            </div>
            <div class="center-details">
                <div class="center-details-1">学分的进度：</div>
                <div class="progress">
          <div class="progress-bar" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width:<%=userTargetList[0].scoreRatio%>%;">
          <%=userTargetList[0].scoreRatio%>%
          </div>
        </div>
            </div>
         </div>
          <div class="col-md-8 col-xs-12">
            <div class="center-details02">
              <p>学习统计</p>
              <p>总学时：<span><%=userTargetList[0].targetConfigBean.targetTotalTime%>小时</span></p>
              <p>总学分：<span><%=userTargetList[0].targetConfigBean.targetTotalScore%>分</span></p>
              <p>累积学完：<span><%=userTargetList[0].totalCourse%>门</span></p>
            </div>
          </div>
        </div>
      </div>
    </div>
    </div> 
</script>
<script type="text/template" id="userSpaceTopNoneTpl">
   <div class="container">
    <div class="row">
      <div class="col-md-12">
        <div class="row">
          <div class="col-md-3">
            <!--个人中心个人信息-->
            <div class="sidenav-center">
              <div class="center-image"><img src="<%= accountBean.headPhoto %>"></div>
              <div class="center-name">
                <p><span class="center-name-top"><%= accountBean.name %></span></p>
              </div>
            </div>
          </div>
          <div class="center-details-big col-md-5 col-xs-12 font-21-white">
				<span class="glyphicon glyphicon-info-sign"></span> 暂无考核指标数据
         </div>

        </div>
      </div>
    </div>
    </div> 
</script>
<!-- 个人课程模板 -->
<script type="text/template" id="useTpl">
   <% _.each(resultList,function(i){%>
     <div class="center-product-list">
      <div class="center-product-left">
        <img src="${contextPath}/components/gtattachment/open/downloadAttachment.json?attachmentId=<%= i.course.defaultImageId%>" width="100%" class="img-responsive">
           <div class="progress-product">
              <div class="progress-bar-product" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width:<%=i.ratio%>%;">
                 <%=i.ratio%>%
              </div>
          </div>
      </div>
      <div class="center-product-right">
        <dl>
          <dt><%=i.course.courseName%></dt>
            <dd><span class="ys">已学<%=i.ratio%>%</span><span>用时<%=i.courseTime%>分</span><span>学习至<%= i.unit.title%></span></dd>
            <dd class="ker"><span>笔记<%=i.notesCount%></span></dd>
            <dd><a href="${contextPath}/portal/frontend/dgo?ftlpath=course/syllabus-particulars-01.ftl#<%= i.course.courseId %>">继续学习</a></dd>
       </dl>
      </div>
      </div>
   <%})%>

</script>
<script type="text/javascript">
  //学习中 已学完 切换
    $(document).ready(function() {
      $('.selection li').click(function(){ 
        $(this).addClass("active").siblings().removeClass("active");
        $(".center-product-blcok").hide().eq($('.selection li').index(this)).show(); 
      });
    });
//  $(document).ready(function() {
//    $('.specified li').click(function(){ 
//      $(this).addClass("active").siblings().removeClass("active");
//      $(".center-product-speci").hide().eq($('.specified li').index(this)).show(); 
//    });
//  });
</script>
</body>
<script src="../../common/jquery-validation/jquery.validate.min.js" type="text/javascript"></script> 
<script src="../../common/jquery-validation/localization/messages_zh.js" type="text/javascript"></script> 
<script src="../../common/klxlearning/cardValid.js" type="text/javascript"></script> 
<script src="${contextPath}/common/jquery-md5/jQuery.md5.js" type="text/javascript"></script> 
<script type="text/javascript" src="${contextPath}/common/klxlearning/underscore-1.8.3-min.js"></script>
<script type="text/javascript" src="${contextPath}/common/klxlearning/userSpace.js"></script>
</html>
